import 'package:flutter/material.dart';

import 'reactive_forms_controller.dart';
import 'package:test_app/core/base/base/base_view.dart';
import 'package:test_app/core/design_system/extensions/extensions.dart';
import 'weiget/build_form.dart';

typedef OnTapWithCtx = VoidCallback? Function(BuildContext context);

class ReactiveFormsView extends BaseView<ReactiveFormsController> {
  const ReactiveFormsView({super.key});

  @override
  String? get navTitle => "表单扩展";

  @override
  Color? get backgroundColor => Color(0xFFF5F5F5);

  @override
  Widget body() {
    return [BaseForm()].toColumn().bouncingScroll();
  }

  @override
  Widget? bottom() {
    return [
      OutlinedButton(
        onPressed: () {},
        style: OutlinedButton.styleFrom(
          foregroundColor: Colors.green, // 文本色
          side: const BorderSide(
            color: Colors.green, // 边框色
            width: 1, // 边框宽度
          ),
        ),
        child: const Text("重置"),
      ).size(120, 50),
      ElevatedButton(
        onPressed: () {},
        // 用 styleFrom 快速设置样式
        style: ElevatedButton.styleFrom(
          backgroundColor: Colors.green, // 背景色（ElevatedButton 特有）
          foregroundColor: Colors.white, // 文本/图标颜色
          disabledBackgroundColor: Colors.grey[300], // 禁用时的背景色
          disabledForegroundColor: Colors.grey[600], // 禁用时的文本色
        ),
        child: const Text("提交"),
      ).height(50).expanded(),
    ].toRowBetween(spacing: 10).height(80).padHorizontal(10).backgroundColor(Colors.white);
  }
}
